<template>
	<view class="container">
		<view v-for="(item, index) in stepList" :key="index" class="item">
			<title-index :title="item.name"></title-index>
			<course-step-view v-for="(step, stepIndex) in item.steps" :key="stepIndex" :step="step" :index="stepIndex"/>
		</view>
	</view>
</template>

<script>
	import CourseStepView from  './components/course-step-view.vue'
	import TitleIndex from '@/components/title-index.vue'
	export default {
		name: "CourseDetailProcessView",
		components: {
			CourseStepView,
			TitleIndex
		},
		props: {
			stepList: {
				type: Array,
				default () {
					return []
				}
			}
		},
		data() {
			return {
				
			}
		},
		methods: {
			
		}
	}
</script>

<style lang="scss">
	.container{
		display: flex;
		flex-direction: column;
		padding-left: 30rpx;
		padding-right: 30rpx;
		
		.item{
			margin-top: 50rpx;
		}
	}
</style>
